﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
<meta charset="utf-8">
<title>我要买车</title>
<!-- Stylesheets -->
<link href="/boot/css/bootstrap.css" rel="stylesheet">
<link href="/boot/plugins/revolution/css/settings.css" rel="stylesheet" type="text/css"><!-- REVOLUTION SETTINGS STYLES -->
<link href="/boot/plugins/revolution/css/layers.css" rel="stylesheet" type="text/css"><!-- REVOLUTION LAYERS STYLES -->
<link href="/boot/plugins/revolution/css/navigation.css" rel="stylesheet" type="text/css"><!-- REVOLUTION NAVIGATION STYLES -->
<link href="/boot/css/style.css" rel="stylesheet">
<link href="/boot/css/responsive.css" rel="stylesheet">
<!--Favicon-->
<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
<link rel="icon" href="images/favicon.png" type="image/x-icon">
<!-- Responsive -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script><![endif]-->
<!--[if lt IE 9]><script src="/boot/js/respond.js"></script><![endif]-->
</head>
<body>

<jsp:include page="../nav.jsp" flush="true"></jsp:include>
    <section class="page-title" style="background-image:url(images/background/5.jpg);">
        <div class="auto-container">
            <h1>汽车市场</h1>
        </div>
    </section>

    <section class="page-info">
        <div class="auto-container">
            <ul class="bread-crumb">
                <li><a href="index.jsp">家</a></li>
                <li>页数</li>
                <li class="current">汽车市场</li>
            </ul>
        </div>
    </section>

    <section class="inventory-section invent-style-two">
        <div class="auto-container">
            <div class="row clearfix">
                <!--Column-->
                <div class="column pull-right col-lg-9 col-md-12 col-sm-12 col-xs-12">
                    <div class="layout-box clearfix">
                        <div class="pull-left">
                            <div class="sort-form">
                                <form action="inventory-form">
                                    <div class="form-group">
                                        <label>排序方式:</label>
                                        <select class="custom-select-box" id="paixu" onblur="paixu()">
                                            <option <c:if test="${paiXu==1}" >selected </c:if> value="1">从高到底</option>
                                            <option <c:if test="${paiXu==0}" >selected </c:if>  value="0">从低到高</option>
                                        </select>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>

                   <c:forEach items="${pageInfo.list}" var="p">
                    <div class="car-block-two">
                        <div class="inner-box">
                            <div class="row clearfix">
                                    <div class="image-column col-md-4 col-sm-4 col-xs-12">
                                        <div class="image">
                                            <a href="/boot/user/shop-single"><img src="http://localhost:80/car/${p.cPhoto}" alt="" /></a>
                                        </div>
                                    </div>
                                    <div class="content-column col-md-8 col-sm-8 col-xs-12">
                                        <h3> <c:forEach items="${carBrands}" var="b">
                                            <c:if test="${p.brId == b.id}">${b.brName}</c:if>
                                        </c:forEach></h3>



                                        <div class="price"><span onclick="detailz(${p.id})">优惠价${p.cPrice}万</div>
                                        <div class="info-box">
                                            <ul class="car-info">
                                                <li><span class="fa fa-road icon"></span><span class="info-title">车龄</span>${p.cAge}</li>
                                                <li><span class="icon fa fa-car"></span><span class="info-title">燃油种类</span>${p.cCus}</li>
                                                <li><span class="icon fa fa-clock-o"></span><span class="info-title">上牌年份</span>${p.cRegistration}</li>
                                                <li><span class="fa fa-gears icon"></span><span class="info-title">变速器</span>${p.cGear}</li>
                                            </ul>
                                        </div>
                                        <!--Checkbox-->
                                        <div class="compare-check"><label for="c_check_1">添加收藏</label><input type="checkbox" id="c_check_1" onclick="collect(${p.id})"></div>

                                    </div>
                            </div>
                        </div>
                    </div>
                    </c:forEach>
                    <div class="container" style="text-align: center">
                        <ul class="pagination">
                            <c:if test="${pageInfo.pageNum>1}">
                                <li><a href="javascript:nextPage(${pageInfo.pageNum-1})">&laquo;</a></li>
                            </c:if>
                            <c:if test="${pageInfo.pageNum<=1}">
                                <li class="disabled"><a>&laquo;</a></li>
                            </c:if>
                            <c:set var="start" value="${pageInfo.pageNum}"></c:set>
                            <c:if test="${pageInfo.pageNum+4<=pageInfo.pages}">
                                <c:set var="end" value="${pageInfo.pageNum+4}"></c:set>
                            </c:if>
                            <c:if test="${pageInfo.pageNum+4>pageInfo.pages}">
                                <c:set var="start" value="${pageInfo.pages-4}"></c:set>
                                <c:set var="end" value="${pageInfo.pages}"></c:set>
                            </c:if>
                            <c:forEach begin="${start<=0?1:start}" end="${end}" var="n">
                                <c:if test="${pageInfo.pageNum==n}">
                                    <li class="active"><a href="javascript:nextPage(${n})">${n}</a></li>
                                </c:if>
                                <c:if test="${pageInfo.pageNum!=n}">
                                    <li><a href="javascript:nextPage(${n})">${n}</a></li>
                                </c:if>
                            </c:forEach>
                            <c:if test="${pageInfo.pageNum<pageInfo.pages}">
                                <li><a href="javascript:nextPage(${pageInfo.pageNum+1})">&raquo;</a></li>
                            </c:if>
                            <c:if test="${pageInfo.pageNum>=pageInfo.pages}">
                                <li class="disabled"><a>&raquo;</a></li>
                            </c:if>
                            <li><a>当前页${pageInfo.pageNum}/${pageInfo.pages}总页</a></li>
                        </ul>
                    </div>
                </div>
                <!--Form Column-->
                <div class="form-column pull-left col-lg-3 col-md-12 col-sm-12 col-xs-12">
                    <!-- Search Box -->
                    <div class="faq-search-box">
                        <div class="outer-box">
<%--                            <form method="post" action="contact.html">--%>
                                <form class="bs-example bs-example-form" role="form" action="/boot/user/searchname">
                                <div class="form-group">
                                    <input type="search" name="searchname" id="searchName" value="" placeholder="请输入您想搜索的车龄" required>
                                    <button type="submit">
                                        <span class="icon fa fa-search"></span>
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <!--Select Car Tabs-->
                    <div class="select-cars-tabs">
                        <!--Tabs Box-->
                        <div class="prod-tabs tabs-box">
                            <!--Tab Btns-->
                            <ul class="tab-btns tab-buttons clearfix">
                                <li data-tab="#prod-new-cars" class="tab-btn active-btn">二手车</li>
                            </ul>
                            <!--Tabs Container-->
                            <div class="tabs-content">
                                <!--Tab / Active Tab-->
                                <div class="tab active-tab" id="二手车">
                                    <div class="content">
                                        <!--Cars Form-->
                                        <div class="cars-form">
                                            <form>
                                                <div class="form-group">
                                                    <label>品牌:</label>
                                                    <select class="custom-select-box" id="brands">
                                                        <option value="-1">===全部品牌===</option>
                                                        <c:forEach items="${carBrands}" var="car">
                                                            <option <c:if test="${brands==car.id}">selected</c:if> value="${car.id}">${car.brName}</option>
                                                        </c:forEach>
                                                    </select>
                                                </div>
                                                <div class="form-group">
                                                    <label>车系:</label>
                                                    <select class="custom-select-box" id="style">
                                                        <option value="-1">===全部车系===</option>
                                                        <c:forEach items="${carStyles}" var="st">
<%--                                                            <option <c:if test="${typeId==t.id}">selected</c:if>  value="${t.id}">${t.name}</option>--%>
                                                            <option <c:if test="${style==st.id}">selected</c:if> value="${st.id}">${st.stName}</option>
                                                        </c:forEach>
                                                    </select>
                                                </div>
<%--                                                <div class="form-group">--%>
<%--                                                    <label>上牌年份:</label>--%>
<%--                                                    <select class="custom-select-box">--%>
<%--                                                        <option>2012-2013</option>--%>
<%--                                                        <option>2013-2014</option>--%>
<%--                                                        <option>2014-2015</option>--%>
<%--                                                        <option>2015-2016</option>--%>
<%--                                                        <option>2016-2017</option>--%>
<%--                                                    </select>--%>
<%--                                                </div>--%>
                                                <div class="row clearfix">
                                                    <div class="form-group inner-group col-md-6 col-sm-6 col-xs-12">
                                                        <label>最低价格:</label>
                                                        <select class="custom-select-box" id="minprice">

                                                            <option <c:if test="${minPrice==1}">selected</c:if> value="10000">10000</option>
                                                            <option <c:if test="${minPrice==2}">selected</c:if> value="20000">20000</option>
                                                            <option <c:if test="${minPrice==3}">selected</c:if> value="30000">30000</option>
                                                            <option <c:if test="${minPrice==4}">selected</c:if> value="40000">40000</option>
                                                            <option <c:if test="${minPrice==5}">selected</c:if> value="50000">50000</option>
                                                            <option <c:if test="${minPrice==6}">selected</c:if> value="60000">60000</option>
                                                            <option <c:if test="${minPrice==7}">selected</c:if> value="70000">70000</option>
                                                            <option <c:if test="${minPrice==8}">selected</c:if> value="10000">80000</option>
                                                            <option <c:if test="${minPrice==9}">selected</c:if> value="10000">90000</option>
                                                            <option <c:if test="${minPrice==10}">selected</c:if> value="10000">100000</option>
                                                            <option <c:if test="${minPrice==11}">selected</c:if> value="110000">110000</option>
                                                            <option <c:if test="${minPrice==12}">selected</c:if> value="120000">120000</option>
                                                            <option <c:if test="${minPrice==13}">selected</c:if> value="130000">130000</option>
                                                            <option <c:if test="${minPrice==14}">selected</c:if> value="140000">140000</option>
                                                            <option <c:if test="${minPrice==15}">selected</c:if> value="150000">150000</option>
                                                        </select>
                                                    </div>
                                                    <div class="form-group inner-group col-md-6 col-sm-6 col-xs-12">
                                                        <label>最高价格:</label>
                                                        <select class="custom-select-box" id="maxprice" >
<%--                                                            <option value="-1">===产品类型===</option>--%>
                                                            <option <c:if test="${maxPrice==5}">selected</c:if> value="50000">50000</option>
                                                            <option <c:if test="${maxPrice==10}">selected</c:if> value="100000">100000</option>
                                                            <option <c:if test="${maxPrice==15}">selected</c:if> value="150000">150000</option>
                                                            <option <c:if test="${maxPrice==20}">selected</c:if> value="200000">200000</option>
                                                            <option <c:if test="${maxPrice==25}">selected</c:if> value="250000">250000</option>
                                                            <option <c:if test="${maxPrice==30}">selected</c:if> value="300000">300000</option>
                                                            <option <c:if test="${maxPrice==35}">selected</c:if> value="350000">350000</option>
                                                            <option <c:if test="${maxPrice==40}">selected</c:if> value="400000">400000</option>
                                                            <option <c:if test="${maxPrice==45}">selected</c:if> value="450000">450000</option>
                                                            <option <c:if test="${maxPrice==50}">selected</c:if> value="500000">500000</option>
                                                            <option <c:if test="${maxPrice==55}">selected</c:if> value="550000">550000</option>
                                                            <option <c:if test="${maxPrice==60}">selected</c:if> value="600000">600000</option>
                                                        </select>
                                                    </div>
                                                </div>
<%--                                                <div class="form-group">--%>
<%--                                                    <label>变速器:</label>--%>
<%--                                                    <select class="custom-select-box">--%>
<%--                                                        <option>半自动</option>--%>
<%--                                                        <option>自动</option>--%>
<%--                                                        <option>手动</option>--%>
<%--                                                        <option>Automatic 3</option>--%>
<%--                                                        <option>Automatic 4</option>--%>
<%--                                                    </select>--%>
<%--                                                </div>--%>
                                                <div class="form-group">
                                                    <button type="button" class="theme-btn btn-style-one" onclick="search()">查找心仪车辆</button>
                                                </div>
                                            </form>
                                        </div>

                                    </div>
                                </div>
                                <!--End Select Car Tabs-->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>

<jsp:include page="../footer.jsp" flush="true"></jsp:include>
<div class="scroll-to-top scroll-to-target" data-target="html"><span class="icon fa fa-angle-up"></span></div>

<script src="/boot/js/jquery.js"></script>
<script src="/boot/js/bootstrap.min.js"></script>
<script src="/boot/js/jquery.fancybox.pack.js"></script>
<script src="/boot/js/jquery.fancybox-media.js"></script>
<script src="/boot/js/owl.js"></script>
<script src="/boot/js/appear.js"></script>
<script src="/boot/js/jquery-ui.js"></script>
<script src="/boot/js/wow.js"></script>
<script src="/boot/js/script.js"></script>
<script>


    function detailz(pid) {
        alert(pid);
        // let x = pid. children().val()
        window.location= "/boot/carts/detailz?pid="+pid;

    }

    function nextPage(pageNow){
        let maxPrice= $("#maxprice").find("option:selected").val()/10000.0;
        let minPrice =$("#minprice").find("option:selected").val()/10000.0;
        let style = document.getElementById("style").value;
        let paixu = $("#paixu").find("option:selected").val();
        alert(paixu);
        // let brands = $("#brands").find("option:selected").val();
        let brands = document.getElementById("brands").value;
         window.location="/boot/user/buycar?pageNow="+pageNow+"&maxPrice="+maxPrice+"&minPrice="+minPrice+"&brands="+brands+"&style="+style+"&paiXu="+paixu;
    }
    // function search_cars(){
    //     let searchName = document.getElementById("searchName").value;
    //     window.location="/mac/product/index?searchName="+searchName;
    // }
    function serchName() {

        let searchName = $("#searchName").val();
        alert(searchName);

    }

    function collect(pid) {
        alert(pid);
        $.post('/boot/user/collect',{"pid":pid},function (data) {

            if(data.code=="200")
            {
                alert("收藏成功");
            }
        })

    }

    function search() {
       let maxPrice= $("#maxprice").find("option:selected").val()/10000.0;
        let minPrice =$("#minprice").find("option:selected").val()/10000.0;
       console.log(maxPrice);

        let style = document.getElementById("style").value;
        let paixu = $("#paixu").find("option:selected").val();
        alert(paixu);
        // let brands = $("#brands").find("option:selected").val();
        let brands = document.getElementById("brands").value;
        // let style = $("#style").find("option:selected").val();
        window.location="/boot/user/buycar?maxPrice="+maxPrice+"&minPrice="+minPrice+"&brands="+brands+"&style="+style+"&paiXu="+paixu;
    }

    // function paixu() {
    //
    //     let paixu= $("#paixu").find("option:selected").val();
    //     window.location="/boot/user/buycar?"
    //
    // }

    // function min_price(obj){
    //     let searchName = document.getElementById("searchName").value;
    //     let typeId = document.getElementById("select_type").value;
    //     window.location="/boot/orange/buycar?searchName="+searchName+"&typeId="+typeId+"&count=1&minPrice="+obj.value;
    // }
    // function maxprice(){
    //
    //
    //     let searchName = document.getElementById("searchName").value;
    //     let typeId = document.getElementById("select_type").value;
    //     window.location="/boot/orange/buycarsearchName="+searchName+"&typeId="+typeId+"&count=1&maxPrice="+obj.value;
    // }
</script>
</body>
</html>
